【第1344期】如何设计提示文字
前言
两则新闻:1.据悉Github已经放弃jQuery了。2.Ant Design of Vue 1.0版本发布了。 今日早读文章由@xuyuehang翻译授权分享。
正文从这开始~
从技术上讲,我是一名作家,我通过写稿来得到报酬,但是大多数人不了解我的是:我讨厌阅读。
不要误解我的意思——我还是读了很多内容,通过书籍和博客,新闻推送和杂志等途径。但当作家变得罗嗦,我的眼光越来越刁钻,每当阅读这些内容时我的大脑时常感到无聊。
当我还是孩童时期时,我一直认为厌恶阅读是我的一个弱点。直到几年后,我才意识到这种 “弱点” 帮助我成为了一名更好的作家。
目前我主要为应用程序和网站撰写界面文本,这需要一种简洁明快,字字斟酌的写作风格。撰写界面文本实际上像是为讨厌阅读的人设计单词一样。
人们不会阅读你的界面说明
许多研究表明人们不会在网上阅读,这也适用于应用程序,游戏或任何其他与人交互的界面。大多数人只是眼睛四处扫描,到处搜集所需要的关键词。
这是由于人们懒惰,粗心,或者他们只是讨厌阅读?无论使用哪种理论,结果都是一样的:人们不会阅读大部分的界面文字——不管你的文字有多棒。
正因为如此,你不应该只是把内容进行说明并直接粘贴到你的设计中。当你写下提示文字时,你可能会发现你的设计需要为之改变。如果你无法用几句话来解释一个动作,这说明你的设计可能太复杂了。
换句话说:你不应该设计 lorem ipsum(乱数假文,指常用于排版设计的无意义的拉丁文字,用来测试文章或文字在不同字型、版型下看起来的效果,译者注),你应该借用文字来突出设计。
文字设计时的 7 个建议
作为一名界面作家,我学到了一些能让你的文字更容易阅读的方法,希望这些提示可以在你编写和设计自己的界面文字时派上用场。
1.压缩文本
最重要的事情就是压缩文本,写完第一份草稿后,一次次地压缩它,去除细节,使用更简单的文字,一针见血。
作为一名作家,我知道当有机会为界面设计文字时人们总想着要施展拳脚,把你所有的想法一股脑地写出来,但为界面设计时不是一个正确场合,你可以在 Medium 等写作平台发泄你的写作欲望。
2.添加标题
有时候,你无法进一步缩短文本,这种情况发生时,你可以看看是否可以能添加一个标题,用几个词语来总结你的文字。用户使用时可能要先搜索关键词,如果他们想要继续了解,可以随时阅读。
3.列表
在浏览网页时,我们的眼睛倾向于上下扫描,正因为如此,列表通常比段落更容易被阅读。如果你发现自己在整个段落中多次使用 “和” 或 “也” 这样的词,请尝试将该段重写为列表。
4.给人适当的缓和空间
有些产品,比如中型产品,内容本身就很重——这没有什么不对。但有时候人们可能很难一段段不停的阅读。
当我需要编写大量内容时,我会尝试添加大量视觉缓冲断点,像是图像,标题和示例——任何可以打破纯文本的东西。因为它可以给人一个喘息的机会,人们需要可以让中途停下来进行思考或者直接跳过。
例如,在我的这篇文章中,我尽量将我的段落保持在几行内容,并且加入了一些视觉断点。
5.文本的优先级
一些作家倾向于过多地关注词语的选择,词语的选择很重要,但我认为这些词语的优先级同样重要。
当你设计文本时,需要先考虑如何优先突出屏幕上最重要的文字,以及淡化不太重要的内容,在设计中被称为视觉层次结构。
字重,大小,颜色,对比度,排版,大小写,间距,邻近度,对齐和移动——所有这些都会影响人们是否阅读你的文字。拨乱一些属性,然后调整其他属性,直到找到合适的平衡点。
6.循序渐进
当你试图教育用户如何做某件事时,将所有这些信息放到一个页面中并希望用户能够一眼得知是很理想化的。更有可能的是,你的文本因此而长过两行导致更多人反而不会去阅读它,所以应该怎么做?
你可以一次向用户显示部分信息。在教科书中被称为渐进式表达,但我喜欢称之为缓慢的揭示。(听起来更有戏剧性,不是吗?)尝试将你的内容分成小块并逐步呈现。
另外你也可以删除一些更详细的信息,并链接到帮助文档。许多产品通过添加 “了解更多” 链接来完成此操作。点击这些链接可以将人们带到具有更多细节的帮助页面。
7.在原型中进行设计,而不是在文档中
你有没有在纸上写过一些看起来不错的东西,但当它实际应用时却反而看起来太长了? 当你在 Google Docs,Dropbox Paper 或任何其他写作应用中撰写内容时,就会发生这种情况。
为界面设计文本时,完整的上下文十分重要。你需要了解你的话将如何影响前后发生的一切。
这就是为什么我喜欢在 Sketch 原型中编写而不是在文档中的原因。我发现在原型中写作有助于反馈设计效果,因为我可以直接看到我的文本在上下文中的展示。
结束语
文字让我们的世界充满意义,它帮助我们理解周围的世界,但很多人并不喜欢阅读。如果你像我一样使用文字,利用文字,我们的目标应该是让阅读尽可能变得简单,继而帮助人们理解。
上面的建议只是我设计文本时的一些尝试,有任何你在设计中的一些建议。
致所有讨厌阅读的人——感谢你们的阅读。
关于本文
译者:@xuyuehang
译文:
https://zhuanlan.zhihu.com/p/35824046
作者:@jsaito
原文:
https://medium.com/@jsaito/how-to-design-words-63d6965051e9
最后,为你推荐
【活动】第四届FEDAY携手中国首届React大会来啦!8月相约广州
有想参加8月18、19号分享会的童鞋,早读君买了会议的优惠码,有需要的话可以私聊我微信:zhgb_f2er